<template>
	<view class="content">
		<view class="logo">
			<image src="../../static/images/logo.png" mode="widthFix"></image>
		</view>
		<view class="loginfo">
			<view class="account">
				<!-- <text>账号：</text>
				<input v-model="phone" class="text" type="text" value="" placeholder="请输入手机号" /> -->
				<text>账号</text>
				<input v-model="phone" class="text" type="text" value="" placeholder="请输入手机号" />
			</view>

			<view class="account">
				<text>密码</text>
				<!-- <input v-model="password" @confirm='login' class="password" type="password" value="" placeholder="请输入密码" /> -->
			
				<input v-model="password" class="password" type="password" value="" placeholder="请输入密码" />
			
			</view>
			<view class="registermi">
				<text @tap="register">立即注册</text>
				<text @tap="fid">找回密码</text>
			</view>
		</view>
		<view class="login" @tap="login">
			<!-- <image src="../../static/images/s29.png" mode="widthFix" ></image> -->
			<text>登录</text>
		</view>
		<!-- <button class="sys_btn" open-type="getUserInfo" lang="zh_CN" @getuserinfo="appLoginWx">{{loginInfo.openid != "" && loginInfo.openid != undefined ? "已授权" : "小程序授权"}}</button> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone: '',
				password: '',
				openid:''
			}
		},
		onBackPress(res){
			if(res.from === 'backbutton'){
				uni.switchTab({
					url:'/pages/index/index'
				})
				return true;
			}
	
		},
		onShow() {

		},
		methods: {
			appLoginWx() {
				var that = this
				// #ifdef MP-WEIXIN
				uni.getProvider({
					service: 'oauth',
					success:(res)=> {
						if (~res.provider.indexOf('weixin')) {
							uni.login({
								provider: 'weixin',
								success: (res) => {
								
									this.$ajax(
										this.apiList.getopenid, {
											code:res.code
										}, 
										'POST',
									).then(res => {
										console.log(res)
										if(res.token){
											uni.setStorageSync('userinfo', res.token);
											this.$sToast(res.msg)
											setTimeout(() => {
												uni.switchTab({
													url: '/pages/index/index',
											
												})
											}, 1500)
										}else{
											that.openid = res.data.openid
										}
										
									})

								},
								fail: () => {
									uni.showToast({
										title: "微信登录授权失败",
										icon: "none"
									});
									// setTimeout(() => {
									// 	uni.switchTab({
									// 		url: '/pages/index/index'
									// 	})
									// }, 1500)
								}
							})

						} else {
							uni.showToast({
								title: '请先安装微信或升级版本',
								icon: "none"
							});
							// setTimeout(() => {
							// 	uni.switchTab({
							// 		url: '/pages/index/index'
							// 	})
							// }, 1500)
						}
					}
				});
				//#endif
			},

			login() {
				this.$ajax(
					this.apiList.login, {
						mobile: this.phone,
						password: this.password,
						openid:this.openid
					},
					'POST',
				).then(res => {
					uni.setStorageSync('userinfo', res.token);
					this.$sToast(res.msg)
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/index/index'
						})
					}, 1500)
				})
			},

			register() {
				uni.navigateTo({
					url: '../register/register'
				})
			},
			fid() {
				uni.navigateTo({
					url: '../fid/fid'
				})
			}
	
		}
	}
</script>

<style lang="scss" scoped>
	.uni-page-head .uni-btn-icon {
	   display: none;
	  }
	.content {
		.logo {
			width: 100%;
			box-sizing: border-box;
			text-align: center;
			margin-top: 80upx;

			image {
				width: 365upx;
			}
		}

		.loginfo {
			width: 100%;
			box-sizing: border-box;
			display: flex;
			flex-direction: column;
			align-items: center;

			.account {
				font-size: 32upx;
				font-family: PingFang SC;
				font-weight: 400;
				margin-bottom: 30upx;
				display: flex;
				align-items: center;
				height: 88rpx;
				line-height: 88rpx;
				border-bottom: 1px solid #f3f4f5;
				width: 80%;

				input {
					margin-top: 30upx;
					width: 480upx;
					height: 88rpx;
					line-height: 50rpx;
					margin: 0;
					padding-left: 20rpx;
					// background: rgba(255, 255, 255, 1);
					// background: url(../../static/images/s27.png) no-repeat;
				}

				text {
					font-size: 32rpx;
				}
			}



			// .password {
			// 	margin-top: 30upx;
			// 	width: 480upx;
			// 	height: 77upx;
			// 	background: rgba(255, 255, 255, 1);
			// 	border: 1upx solid rgba(112, 112, 112, 1);
			// 	border-radius: 10upx;
			// 	background: url(../../static/images/s28.png) no-repeat;
			// 	background-size: 6%;
			// 	background-position: 3%;
			// 	padding-left: 60upx;
			// }


		}

		.registermi {
			width: 100%;
			margin-top: 20upx;
			display: flex;
			justify-content: flex-end;
			margin-left: -10%;

			text {
				margin-left: 20rpx;
				font-size: 20upx;
				color: rgba(35, 153, 246, 1);
				// border-bottom: 1upx solid rgba(35, 153, 246, 1);
			}
		}

		.login {
			width: 100%;
			box-sizing: border-box;
			text-align: center;
			margin-top: 64upx;
			background: red;
			width: 80%;
			margin-left: 10%;
			height: 86rpx;
			line-height: 86rpx;
			border-radius: 10rpx;
			background: #13CA62;
			font-size: 32rpx;
			color: #fff;
		}
	}
</style>
